// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.username-input {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 2px;
  justify-content: flex-start;
  min-width: 0; // so user-card-brick overflows properly.

  &--beatmap-owner-editor {
    min-height: 20px;
  }

  &__input {
    .reset-input();
    color: hsl(var(--hsl-c1));

    flex: 1;
    order: 1;
    // can't do much about wrapping the input itself...
    min-width: 40px;
  }

  &__spinner {
    display: inline-flex;
    order: 2;
    align-items: center;
    min-width: 1em;
  }
}
